import { ElNotification } from 'element-plus'

// 八字排盘API接口
import {
    paiPanApi, // 开始排盘
    daYunInitializeApi, // 大运流年初始化
    daYunApi, // 点击大运
    liuNianApi, // 点击流年
    liuYueApi, // 点击流月
    liuRiApi, // 点击流日
    liuShiApi, // 点击流时
    taiMingShenApi // 点击胎命身
} from '@/api/paipan/bazi-api.js'

export default {
    el: 'app',
    data() {
        return {

            // 选项
            options: {
                name: '', // 姓名
                occupy: '', // 占事
                date: '', // 日期
                leapMonth: 0, // 是否闰月（true:是。false:否）
                dateType: 0, // 日期类型
                sex: 1, // 性别
                qiYunLiuPai: 1, // 起运流派
                jieQiSet: 1, // 节气排法
                renYuanType: 0, // 人元司令分野类型
                yearGanZhiSet: 2, // 年干支设置
                monthGanZhiSet: 1, // 月干支设置
                dayGanZhiSet: 0, // 日干支设置
                hourGanZhiSet: 0 // 时干支设置
            },
            sexOptions: [
                { value: 1, label: '男' },
                { value: 0, label: '女' }
            ],
            leapMonthOptions: [
                { value: 0, label: '非闰月' },
                { value: 1, label: '闰月' }
            ],
            dateTypeOptions: [
                { value: 0, label: '公历' },
                { value: 1, label: '农历' }
            ],
            qiYunLiuPaiOptions: [
                { value: 0, label: '按天和时辰计算' },
                { value: 1, label: '按分钟计算' }
            ],
            jieQiSetOptions: [
                { value: 0, label: '按天计算' },
                { value: 1, label: '按分钟计算' }
            ],
            renYuanTypeOptions: [
                { value: 0, label: '子平真诠法诀' },
                { value: 1, label: '渊海子平法诀' },
                { value: 2, label: '星平会海法诀' },
                { value: 3, label: '三命通会法诀' },
                { value: 4, label: '神峰通考法诀' },
                { value: 5, label: '万育吾之法诀' }
            ],
            yearGanZhiSetOptions: [
                { value: 0, label: '以正月初一作为新年的开始' },
                { value: 1, label: '以立春当天作为新年的开始' },
                { value: 2, label: '以立春交接时刻作为新年的开始' }
            ],
            monthGanZhiSetOptions: [
                { value: 0, label: '以节交接当天起算' },
                { value: 1, label: '以节交接时刻起算' }
            ],
            dayGanZhiSetOptions: [
                { value: 0, label: '晚子时日干支算当天' },
                { value: 1, label: '晚子时日干支算明天' }
            ],
            hourGanZhiSetOptions: [
                { value: 0, label: '支持早子时和晚子时' }
            ],


            // 数据
            data: {}, // 数据
            isData: false, // 数据状态（true:存在。false:不存在）
            dataPage: 1, // 数据显示界面（1:基础信息。2:命盘信息。3:更多信息）
            caiHuaTab: '1', // 正财年卡片（1:正财年。2:偏财年。3:正桃花年。4:偏桃花年）

            mingPanMode: 2, // 左侧·命盘类型（1:四柱。2:默认。3:胎命身）
            mingPanModeOptions: [
                { value: 1, label: '四柱' },
                { value: 2, label: '默认' },
                { value: 3, label: '胎命身' }
            ],

            daYunMingPanData: {}, // 左侧·大运命盘数据
            liuNianMingPanData: {}, // 左侧·流年命盘数据
            liuYueMingPanData: {}, // 左侧·流月命盘数据
            liuRiMingPanData: {}, // 左侧·流日命盘数据
            liuShiMingPanData: {}, // 左侧·流时命盘数据

            taiMingShenMingPanData: {}, // 左侧·胎命身命盘数据

            daYunData: {}, // 右侧·大运数据
            liuNianData: {}, // 右侧·流年数据
            xiaoYunData: {}, // 右侧·小运数据
            liuYueData: {}, // 右侧·流月数据
            liuRiData: {}, // 右侧·流日数据
            liuShiData: {}, // 右侧·流时数据

            isDaYunData: false, // 大运流年数据状态（true:存在。false:不存在）

            daYunDataFirst: {}, // 右侧·第一轮大运数据
            liuNianDataFirst: {}, // 右侧·第一轮流年数据
            xiaoYunDataFirst: {}, // 右侧·第一轮小运数据
            liuYueDataFirst: {}, // 右侧·第一轮流月数据

            tianGanLiuYi: {}, // 天干留意
            diZhiLiuYi: {}, // 地支留意
            tianGanLiuYiBei: {}, // 天干留意(备份)
            diZhiLiuYiBei: {}, // 地支留意(备份)

            isDaYunMingPan: true, // 左侧·是否显示大运命盘（true:是。false:否）
            isLiuNianMingPan: true, // 左侧·是否显示流年命盘（true:是。false:否）
            isLiuYueMingPan: false, // 左侧·是否显示流月命盘（true:是。false:否）
            isLiuRiMingPan: false, // 左侧·是否显示流日命盘（true:是。false:否）
            isLiuShiMingPan: false, // 左侧·是否显示流时命盘（true:是。false:否）
            isTaiYuanMingPan: false, // 左侧·是否显示胎元命盘（true:是。false:否）
            isTaiXiMingPan: false, // 左侧·是否显示胎息命盘（true:是。false:否）
            isMingGongMingPan: false, // 左侧·是否显示命宫命盘（true:是。false:否）
            isShenGongMingPan: false, // 左侧·是否显示身宫命盘（true:是。false:否）

            isLiuRiData: false, // 右侧·是否显示流日数据（true:是。false:否）
            isLiuShiData: false, // 右侧·是否显示流时数据（true:是。false:否）

            daYunLun: 1, // 大运轮
            liuNianLun: 1, // 流年轮
            liuYueLun: 0, // 流月轮
            liuRiLun: 0, // 流日轮
            liuShiLun: 0, // 流时轮

            daYunGanZhi: '', // 大运干支
            liuNianGanZhi: '', // 流年干支
            xiaoYunGanZhi: '', // 小运干支
            liuYueGanZhi: '', // 流月干支
            liuRiGanZhi: '', // 流日干支
            liuShiGanZhi: '', // 流时干支

            // 其他
            muColor: '#00ad00', // 五行木颜色
            huoColor: '#d40000', // 五行火颜色
            tuColor: '#b16400', // 五行土颜色
            jinColor: '#efa800', // 五行金颜色
            shuiColor: '#2e83f6', // 五行水颜色
            ganZhiYinYang: false // 干支阴阳（true:阴干支显示斜体。false:阴干支不显示斜体）
        }
    },
    watch: {
        /**
         * 命盘模式监听
         */
        mingPanMode(val) {
            if (val === 1) {
                // 四柱
                this.isDaYunMingPan = false; // 左侧·是否显示大运命盘（true:是。false:否）
                this.isLiuNianMingPan = false; // 左侧·是否显示流年命盘（true:是。false:否）
                this.isLiuYueMingPan = false; // 左侧·是否显示流月命盘（true:是。false:否）
                this.isLiuRiMingPan = false; // 左侧·是否显示流日命盘（true:是。false:否）
                this.isLiuShiMingPan = false; // 左侧·是否显示流时命盘（true:是。false:否）
                this.isTaiYuanMingPan = false; // 左侧·是否显示胎元命盘（true:是。false:否）
                this.isTaiXiMingPan = false; // 左侧·是否显示胎息命盘（true:是。false:否）
                this.isMingGongMingPan = false; // 左侧·是否显示命宫命盘（true:是。false:否）
                this.isShenGongMingPan = false; // 左侧·是否显示身宫命盘（true:是。false:否）
                this.tianGanLiuYi = this.data.tianGanLiuYi; // 天干留意
                this.diZhiLiuYi = this.data.diZhiLiuYi; // 地支留意
            } else if (val === 2) {
                // 默认
                this.isDaYunMingPan = true; // 左侧·是否显示大运命盘（true:是。false:否）
                this.isLiuNianMingPan = true; // 左侧·是否显示流年命盘（true:是。false:否）
                this.isLiuYueMingPan = false; // 左侧·是否显示流月命盘（true:是。false:否）
                this.isLiuRiMingPan = false; // 左侧·是否显示流日命盘（true:是。false:否）
                this.isLiuShiMingPan = false; // 左侧·是否显示流时命盘（true:是。false:否）
                this.isTaiYuanMingPan = false; // 左侧·是否显示胎元命盘（true:是。false:否）
                this.isTaiXiMingPan = false; // 左侧·是否显示胎息命盘（true:是。false:否）
                this.isMingGongMingPan = false; // 左侧·是否显示命宫命盘（true:是。false:否）
                this.isShenGongMingPan = false; // 左侧·是否显示身宫命盘（true:是。false:否）
                this.tianGanLiuYi = this.tianGanLiuYiBei; // 天干留意
                this.diZhiLiuYi = this.diZhiLiuYiBei; // 地支留意
            } else if (val === 3) {
                // 胎命身
                this.taiMingShenMethod(); // 胎命身
            }
        }
    },
    created() {
        this.options.date = new Date();
    },
    mounted() {
        this.$refs.videoRef.addEventListener('ended', this.restartVideoMethod());
    },
    methods: {

        /**
         * 播放MP4
         */
        restartVideoMethod() {

            this.$refs.videoRef.currentTime = 0;
            this.$refs.videoRef.play();

        },

        /**
         * 开始排盘
         */
        paiPanMethod() {

            // 条件构造
            let query = this.options;

            // 发送请求
            paiPanApi(query).then((res) => {
                if (String(res.data.code) === '200' && null !== res.data.data) {
                    var data = res.data.data;

                    this.data = data; // 排盘数据

                    // 处理数据
                    this.muCount = data.ganMuCount + data.zhiMuCount; // 五行木数量（干支）
                    this.huoCount = data.ganHuoCount + data.zhiHuoCount; // 五行火数量（干支）
                    this.tuCount = data.ganTuCount + data.zhiTuCount; // 五行土数量（干支）
                    this.jinCount = data.ganJinCount + data.zhiJinCount; // 五行金数量（干支）
                    this.shuiCount = data.ganShuiCount + data.zhiShuiCount; // 五行水数量（干支）

                    this.isData = true; // 数据状态（true:存在。false:不存在）

                }
            })

        },

        /**
         * 大运流年初始化
         */
        daYunInitializeMethod() {

            // 判断是否已初始化大运流年
            if (this.isDaYunData) {
                this.dataPage = 2; // 数据显示界面（1:基础信息。2:命盘信息。3:更多信息）
                return;
            }

            // 条件构造
            let query = {
                yearGan: this.data.yearGan, // 年干
                monthGan: this.data.monthGan, // 月干
                dayGan: this.data.dayGan, // 日干
                hourGan: this.data.hourGan, // 时干

                yearZhi: this.data.yearZhi, // 年支
                monthZhi: this.data.monthZhi, // 月支
                dayZhi: this.data.dayZhi, // 日支
                hourZhi: this.data.hourZhi, // 时支

                solarDate: this.data.solarDate, // 公历日期
                sex: this.data.sex, // 性别
                qiYunLiuPai: this.qiYunLiuPai, // 起运流派
                season: this.data.season, // 季节
                yearGanZhiNaYin: this.data.yearGanZhiNaYin // 年干支纳音
            }

            // 发送请求
            daYunInitializeApi(query).then((res) => {
                if (String(res.data.code) === '200' && null !== res.data.data) {
                    var data = res.data.data;

                    this.daYunMingPanData = data; // 左侧·大运命盘数据
                    this.liuNianMingPanData = data; // 左侧·流年命盘数据

                    this.daYunData = data.daYun; // 右侧·大运数据
                    this.liuNianData = data.liuNian; // 右侧·流年数据
                    this.xiaoYunData = data.xiaoYun; // 右侧·小运数据
                    this.liuYueData = data.liuYue; // 右侧·流月数据

                    this.daYunDataFirst = data.daYun; // 右侧·第一轮大运数据
                    this.liuNianDataFirst = data.liuNian; // 右侧·第一轮流年数据
                    this.xiaoYunDataFirst = data.xiaoYun; // 右侧·第一轮小运数据
                    this.liuYueDataFirst = data.liuYue; // 右侧·第一轮流月数据

                    this.tianGanLiuYi = data.tianGanLiuYi; // 天干留意
                    this.diZhiLiuYi = data.diZhiLiuYi; // 地支留意
                    this.tianGanLiuYiBei = data.tianGanLiuYi; // 天干留意(备份)
                    this.diZhiLiuYiBei = data.diZhiLiuYi; // 地支留意(备份)

                    this.isDaYunData = true; // 数据状态（true:存在。false:不存在）
                    this.dataPage = 2; // 数据显示界面（1:基础信息。2:命盘信息。3:更多信息）
                }
            })

        },

        /**
         * 点击大运
         * 
         * @param daYunLun       大运轮
         * @param daYunGanZhi    大运干支
         * @param daYunSolarDate 大运公历日期
         */
        daYunMethod(daYunLun, daYunGanZhi, daYunSolarDate) {

            this.mingPanMode = 2; // 左侧·命盘类型（1:四柱。2:默认。3:胎命身）
            this.daYunLun = daYunLun; // 设置大运轮
            this.isDaYunMingPan = true; // 左侧·是否显示大运命盘（true:是。false:否）
            this.isLiuNianMingPan = true; // 左侧·是否显示流年命盘（true:是。false:否）
            this.isLiuYueMingPan = false; // 左侧·是否显示流月命盘（true:是。false:否）
            this.isLiuRiMingPan = false; // 左侧·是否显示流日命盘（true:是。false:否）
            this.isLiuShiMingPan = false; // 左侧·是否显示流时命盘（true:是。false:否）
            this.isTaiYuanMingPan = false; // 左侧·是否显示胎元命盘（true:是。false:否）
            this.isTaiXiMingPan = false; // 左侧·是否显示胎息命盘（true:是。false:否）
            this.isMingGongMingPan = false; // 左侧·是否显示命宫命盘（true:是。false:否）
            this.isShenGongMingPan = false; // 左侧·是否显示身宫命盘（true:是。false:否）
            this.isLiuRiData = false; // 右侧·是否显示流日数据（true:是。false:否）
            this.isLiuShiData = false; // 右侧·是否显示流时数据（true:是。false:否）
            this.liuNianLun = 1; // 重置流年轮
            this.liuYueLun = 0; // 重置流月轮
            this.liuRiLun = 0; // 重置流日轮
            this.liuShiLun = 0; // 重置流时轮
            this.liuRiData = {}; // 清空流日数据
            this.liuShiData = {}; // 清空流时数据

            // 设置大运干支
            if (daYunLun === 1) {
                this.liuNianXiaoYunLun = 1; // 流年轮数重置为第一轮
                if (this.xiaoYunData.length === 0) {
                    this.daYunGanZhi = this.daYunData[1].ganZhi; // 大运干支。若小运数据个数为0，直接取第一轮的第一个大运干支
                } else {
                    this.daYunGanZhi = this.xiaoYunDataFirst[0].ganZhi; // 大运干支。将大运干支替换为第一轮的第一个小运干支
                }
            } else {
                this.daYunGanZhi = daYunGanZhi; // 大运干支
            }

            // 条件构造
            let query = {
                yearGan: this.data.yearGan, // 年干
                monthGan: this.data.monthGan, // 月干
                dayGan: this.data.dayGan, // 日干
                hourGan: this.data.hourGan, // 时干
                daYunGan: this.daYunGanZhi.substring(0, 1), // 大运干

                yearZhi: this.data.yearZhi, // 年支
                monthZhi: this.data.monthZhi, // 月支
                dayZhi: this.data.dayZhi, // 日支
                hourZhi: this.data.hourZhi, // 时支
                daYunZhi: this.daYunGanZhi.substring(1, 2), // 大运支

                daYunLun: daYunLun, // 大运轮
                liuNianLun: this.liuNianLun, // 流年轮

                daYunSolarDate: daYunSolarDate, // 大运公历日期
                solarDate: this.data.solarDate, // 公历日期
                sex: this.data.sex, // 性别
                qiYunLiuPai: this.qiYunLiuPai, // 起运流派
                season: this.data.season, // 季节
                yearGanZhiNaYin: this.data.yearGanZhiNaYin // 年干支纳音
            }

            // 发送请求
            daYunApi(query).then((res) => {
                if (String(res.data.code) === '200' && null !== res.data.data) {
                    var data = res.data.data;

                    this.daYunMingPanData = data; // 左侧·大运命盘数据
                    this.liuNianMingPanData = data; // 左侧·流年命盘数据
                    this.liuYueMingPanData = data; // 左侧·流月命盘数据

                    // this.daYunData = data.daYun; // 右侧·大运数据
                    this.liuNianData = data.liuNian; // 右侧·流年数据
                    this.xiaoYunData = data.xiaoYun; // 右侧·小运数据
                    this.liuYueData = data.liuYue; // 右侧·流月数据

                    this.tianGanLiuYi = data.tianGanLiuYi; // 天干留意
                    this.diZhiLiuYi = data.diZhiLiuYi; // 地支留意
                    this.tianGanLiuYiBei = data.tianGanLiuYi; // 天干留意(备份)
                    this.diZhiLiuYiBei = data.diZhiLiuYi; // 地支留意(备份)

                    // 若大运轮数为1，则重置流年干支
                    if (daYunLun === 1) {
                        this.liuNianGanZhi = data.liuNianGanZhi; // 重置流年干支
                    }
                }
            })

        },

        /**
         * 点击流年
         * 
         * @param liuNianLun       流年轮
         * @param liuNianGanZhi    流年干支
         * @param liuNianSolarDate 流年公历日期
         * @param isXiaoYunGanZhi  是否转为小运干支（true:是。false:否）
         */
        liuNianMethod(liuNianLun, liuNianGanZhi, liuNianSolarDate, isXiaoYunGanZhi) {

            this.mingPanMode = 2; // 左侧·命盘类型（1:四柱。2:默认。3:胎命身）
            this.liuNianLun = liuNianLun; // 设置流年轮
            this.liuNianGanZhi = liuNianGanZhi; // 设置流年干支
            this.isDaYunMingPan = true; // 左侧·是否显示大运命盘（true:是。false:否）
            this.isLiuNianMingPan = true; // 左侧·是否显示流年命盘（true:是。false:否）
            this.isLiuYueMingPan = false; // 左侧·是否显示流月命盘（true:是。false:否）
            this.isLiuRiMingPan = false; // 左侧·是否显示流日命盘（true:是。false:否）
            this.isLiuShiMingPan = false; // 左侧·是否显示流时命盘（true:是。false:否）
            this.isTaiYuanMingPan = false; // 左侧·是否显示胎元命盘（true:是。false:否）
            this.isTaiXiMingPan = false; // 左侧·是否显示胎息命盘（true:是。false:否）
            this.isMingGongMingPan = false; // 左侧·是否显示命宫命盘（true:是。false:否）
            this.isShenGongMingPan = false; // 左侧·是否显示身宫命盘（true:是。false:否）
            this.isLiuRiData = false; // 右侧·是否显示流日数据（true:是。false:否）
            this.isLiuShiData = false; // 右侧·是否显示流时数据（true:是。false:否）
            this.liuYueLun = 0; // 重置流月轮
            this.liuRiLun = 0; // 重置流日轮
            this.liuShiLun = 0; // 重置流时轮
            this.liuRiData = {}; // 清空流日数据
            this.liuShiData = {}; // 清空流时数据

            // 处理流年干支
            if (this.daYunLun === 1) {
                if (this.xiaoYunData.length === 0) {
                    this.daYunGanZhi = this.daYunData[1].ganZhi; // 大运干支。若小运数据个数为0，直接取第一轮的第一个大运干支
                } else {
                    if (isXiaoYunGanZhi) {
                        this.daYunGanZhi = this.xiaoYunDataFirst[liuNianLun - 1].ganZhi; // 大运干支。将大运干支替换为第一轮的第[liuNianLun - 1]个小运干支
                    } else {
                        this.daYunGanZhi = this.xiaoYunDataFirst[0].ganZhi; // 大运干支。将大运干支替换为第一轮的第一个小运干支
                    }
                }
            }

            // 条件构造
            let query = {
                yearGan: this.data.yearGan, // 年干
                monthGan: this.data.monthGan, // 月干
                dayGan: this.data.dayGan, // 日干
                hourGan: this.data.hourGan, // 时干
                daYunGan: this.daYunGanZhi.substring(0, 1), // 大运干
                liuNianGan: liuNianGanZhi.substring(0, 1), // 流年干

                yearZhi: this.data.yearZhi, // 年支
                monthZhi: this.data.monthZhi, // 月支
                dayZhi: this.data.dayZhi, // 日支
                hourZhi: this.data.hourZhi, // 时支
                daYunZhi: this.daYunGanZhi.substring(1, 2), // 大运支
                liuNianZhi: liuNianGanZhi.substring(1, 2), // 流年支

                daYunLun: this.daYunLun, // 大运轮
                liuNianLun: liuNianLun, // 流年轮

                liuNianSolarDate: liuNianSolarDate, // 流年公历日期
                solarDate: this.data.solarDate, // 公历日期
                sex: this.data.sex, // 性别
                qiYunLiuPai: this.qiYunLiuPai, // 起运流派
                season: this.data.season, // 季节
                yearGanZhiNaYin: this.data.yearGanZhiNaYin // 年干支纳音
            }

            // 发送请求
            liuNianApi(query).then((res) => {
                if (String(res.data.code) === '200' && null !== res.data.data) {
                    var data = res.data.data;

                    this.daYunMingPanData = data; // 左侧·大运命盘数据
                    this.liuNianMingPanData = data; // 左侧·流年命盘数据

                    this.liuYueData = data.liuYue; // 右侧·流月数据

                    this.tianGanLiuYi = data.tianGanLiuYi; // 天干留意
                    this.diZhiLiuYi = data.diZhiLiuYi; // 地支留意
                    this.tianGanLiuYiBei = data.tianGanLiuYi; // 天干留意(备份)
                    this.diZhiLiuYiBei = data.diZhiLiuYi; // 地支留意(备份)
                }
            })

        },

        /**
         * 点击流月
         * 
         * @param liuYueLun    流月轮
         * @param liuYueGanZhi 流月干支
         * @param solarDate    流月公历日期
         */
        liuYueMethod(liuYueLun, liuYueGanZhi, liuYueSolarDate) {

            this.mingPanMode = 2; // 左侧·命盘类型（1:四柱。2:默认。3:胎命身）
            this.liuYueLun = liuYueLun; // 设置流月轮
            this.liuYueGanZhi = liuYueGanZhi; // 设置流月干支
            this.isDaYunMingPan = true; // 左侧·是否显示大运命盘（true:是。false:否）
            this.isLiuNianMingPan = true; // 左侧·是否显示流年命盘（true:是。false:否）
            // this.isLiuYueMingPan = true; // 左侧·是否显示流月命盘（true:是。false:否）
            this.isLiuRiMingPan = false; // 左侧·是否显示流日命盘（true:是。false:否）
            this.isLiuShiMingPan = false; // 左侧·是否显示流时命盘（true:是。false:否）
            this.isTaiYuanMingPan = false; // 左侧·是否显示胎元命盘（true:是。false:否）
            this.isTaiXiMingPan = false; // 左侧·是否显示胎息命盘（true:是。false:否）
            this.isMingGongMingPan = false; // 左侧·是否显示命宫命盘（true:是。false:否）
            this.isShenGongMingPan = false; // 左侧·是否显示身宫命盘（true:是。false:否）
            this.isLiuShiData = false; // 右侧·是否显示流时数据（true:是。false:否）
            this.liuRiLun = 0; // 重置流日轮
            this.liuShiLun = 0; // 重置流时轮
            this.liuShiData = {}; // 清空流时数据

            // 条件构造
            let query = {
                yearGan: this.data.yearGan, // 年干
                monthGan: this.data.monthGan, // 月干
                dayGan: this.data.dayGan, // 日干
                hourGan: this.data.hourGan, // 时干
                daYunGan: this.daYunGanZhi.substring(0, 1), // 大运干
                liuNianGan: this.liuNianGanZhi.substring(0, 1), // 流年干
                liuYueGan: liuYueGanZhi.substring(0, 1), // 流月干

                yearZhi: this.data.yearZhi, // 年支
                monthZhi: this.data.monthZhi, // 月支
                dayZhi: this.data.dayZhi, // 日支
                hourZhi: this.data.hourZhi, // 时支
                daYunZhi: this.daYunGanZhi.substring(1, 2), // 大运支
                liuNianZhi: this.liuNianGanZhi.substring(1, 2), // 流年支
                liuYueZhi: liuYueGanZhi.substring(1, 2), // 流月支

                liuYueSolarDate: liuYueSolarDate, // 流月公历日期
                solarDate: this.data.solarDate, // 公历日期
                sex: this.data.sex, // 性别
                qiYunLiuPai: this.qiYunLiuPai, // 起运流派
                qiYunLiuPai: this.jieQiSet, // 节气排法
                season: this.data.season, // 季节
                yearGanZhiNaYin: this.data.yearGanZhiNaYin // 年干支纳音
            }

            // 发送请求
            liuYueApi(query).then((res) => {
                if (String(res.data.code) === '200' && null !== res.data.data) {
                    var data = res.data.data;

                    this.liuYueMingPanData = data; // 左侧·流月命盘数据

                    this.liuRiData = data.liuRi; // 右侧·流日数据

                    this.tianGanLiuYi = data.tianGanLiuYi; // 天干留意
                    this.diZhiLiuYi = data.diZhiLiuYi; // 地支留意
                    this.tianGanLiuYiBei = data.tianGanLiuYi; // 天干留意(备份)
                    this.diZhiLiuYiBei = data.diZhiLiuYi; // 地支留意(备份)

                    this.isLiuYueMingPan = true; // 左侧·是否显示流月命盘（true:是。false:否）
                    this.isLiuRiData = true; // 右侧·是否显示流日数据（true:是。false:否）
                }
            })

        },

        /**
         * 点击流日
         * 
         * @param liuRiLun    流日轮
         * @param liuRiGanZhi 流日干支
         * @param solarDate   流日公历日期
         */
        liuRiMethod(liuRiLun, liuRiGanZhi, liuRiSolarDate) {

            this.mingPanMode = 2; // 左侧·命盘类型（1:四柱。2:默认。3:胎命身）
            this.liuRiLun = liuRiLun; // 设置流日轮
            this.liuRiGanZhi = liuRiGanZhi; // 设置流日干支
            this.isDaYunMingPan = true; // 左侧·是否显示大运命盘（true:是。false:否）
            this.isLiuNianMingPan = true; // 左侧·是否显示流年命盘（true:是。false:否）
            this.isLiuYueMingPan = true; // 左侧·是否显示流月命盘（true:是。false:否）
            // this.isLiuRiMingPan = true; // 左侧·是否显示流日命盘（true:是。false:否）
            this.isLiuShiMingPan = false; // 左侧·是否显示流时命盘（true:是。false:否）
            this.isTaiYuanMingPan = false; // 左侧·是否显示胎元命盘（true:是。false:否）
            this.isTaiXiMingPan = false; // 左侧·是否显示胎息命盘（true:是。false:否）
            this.isMingGongMingPan = false; // 左侧·是否显示命宫命盘（true:是。false:否）
            this.isShenGongMingPan = false; // 左侧·是否显示身宫命盘（true:是。false:否）
            this.liuShiLun = 0; // 重置流时轮

            // 条件构造
            let query = {
                yearGan: this.data.yearGan, // 年干
                monthGan: this.data.monthGan, // 月干
                dayGan: this.data.dayGan, // 日干
                hourGan: this.data.hourGan, // 时干
                daYunGan: this.daYunGanZhi.substring(0, 1), // 大运干
                liuNianGan: this.liuNianGanZhi.substring(0, 1), // 流年干
                liuYueGan: this.liuYueGanZhi.substring(0, 1), // 流月干
                liuRiGan: liuRiGanZhi.substring(0, 1), // 流日干

                yearZhi: this.data.yearZhi, // 年支
                monthZhi: this.data.monthZhi, // 月支
                dayZhi: this.data.dayZhi, // 日支
                hourZhi: this.data.hourZhi, // 时支
                daYunZhi: this.daYunGanZhi.substring(1, 2), // 大运支
                liuNianZhi: this.liuNianGanZhi.substring(1, 2), // 流年支
                liuYueZhi: this.liuYueGanZhi.substring(1, 2), // 流月支
                liuRiZhi: liuRiGanZhi.substring(1, 2), // 流日支

                liuRiSolarDate: liuRiSolarDate, // 流日公历日期
                solarDate: this.data.solarDate, // 公历日期
                sex: this.data.sex, // 性别
                qiYunLiuPai: this.qiYunLiuPai, // 起运流派
                season: this.data.season, // 季节
                yearGanZhiNaYin: this.data.yearGanZhiNaYin // 年干支纳音
            }

            // 发送请求
            liuRiApi(query).then((res) => {
                if (String(res.data.code) === '200' && null !== res.data.data) {
                    var data = res.data.data;

                    this.liuRiMingPanData = data; // 左侧·流日命盘数据

                    this.liuShiData = data.liuShi; // 右侧·流时数据

                    this.tianGanLiuYi = data.tianGanLiuYi; // 天干留意
                    this.diZhiLiuYi = data.diZhiLiuYi; // 地支留意
                    this.tianGanLiuYiBei = data.tianGanLiuYi; // 天干留意(备份)
                    this.diZhiLiuYiBei = data.diZhiLiuYi; // 地支留意(备份)

                    this.isLiuRiMingPan = true; // 左侧·是否显示流日命盘（true:是。false:否）
                    this.isLiuShiData = true; // 右侧·是否显示流时数据（true:是。false:否）
                }
            })

        },

        /**
         * 点击流时
         * 
         * @param liuShiLun    流时轮
         * @param liuShiGanZhi 流时干支
         */
        liuShiMethod(liuShiLun, liuShiGanZhi) {

            this.mingPanMode = 2; // 左侧·命盘类型（1:四柱。2:默认。3:胎命身）
            this.liuShiLun = liuShiLun; // 设置流时轮
            this.liuShiGanZhi = liuShiGanZhi; // 设置流时干支
            this.isDaYunMingPan = true; // 左侧·是否显示大运命盘（true:是。false:否）
            this.isLiuNianMingPan = true; // 左侧·是否显示流年命盘（true:是。false:否）
            this.isLiuYueMingPan = true; // 左侧·是否显示流月命盘（true:是。false:否）
            this.isLiuRiMingPan = true; // 左侧·是否显示流日命盘（true:是。false:否）
            // this.isLiuShiMingPan = true; // 左侧·是否显示流时命盘（true:是。false:否）
            this.isTaiYuanMingPan = false; // 左侧·是否显示胎元命盘（true:是。false:否）
            this.isTaiXiMingPan = false; // 左侧·是否显示胎息命盘（true:是。false:否）
            this.isMingGongMingPan = false; // 左侧·是否显示命宫命盘（true:是。false:否）
            this.isShenGongMingPan = false; // 左侧·是否显示身宫命盘（true:是。false:否）

            // 条件构造
            let query = {
                yearGan: this.data.yearGan, // 年干
                monthGan: this.data.monthGan, // 月干
                dayGan: this.data.dayGan, // 日干
                hourGan: this.data.hourGan, // 时干
                daYunGan: this.daYunGanZhi.substring(0, 1), // 大运干
                liuNianGan: this.liuNianGanZhi.substring(0, 1), // 流年干
                liuYueGan: this.liuYueGanZhi.substring(0, 1), // 流月干
                liuRiGan: this.liuRiGanZhi.substring(0, 1), // 流日干
                liuShiGan: liuShiGanZhi.substring(0, 1), // 流时干

                yearZhi: this.data.yearZhi, // 年支
                monthZhi: this.data.monthZhi, // 月支
                dayZhi: this.data.dayZhi, // 日支
                hourZhi: this.data.hourZhi, // 时支
                daYunZhi: this.daYunGanZhi.substring(1, 2), // 大运支
                liuNianZhi: this.liuNianGanZhi.substring(1, 2), // 流年支
                liuYueZhi: this.liuYueGanZhi.substring(1, 2), // 流月支
                liuRiZhi: this.liuRiGanZhi.substring(1, 2), // 流日支
                liuShiZhi: liuShiGanZhi.substring(1, 2), // 流时支

                solarDate: this.data.solarDate, // 公历日期
                sex: this.data.sex, // 性别
                qiYunLiuPai: this.qiYunLiuPai, // 起运流派
                season: this.data.season, // 季节
                yearGanZhiNaYin: this.data.yearGanZhiNaYin // 年干支纳音
            }

            // 发送请求
            liuShiApi(query).then((res) => {
                if (String(res.data.code) === '200' && null !== res.data.data) {
                    var data = res.data.data;

                    this.liuShiMingPanData = data; // 左侧·流时命盘数据

                    this.tianGanLiuYi = data.tianGanLiuYi; // 天干留意
                    this.diZhiLiuYi = data.diZhiLiuYi; // 地支留意
                    this.tianGanLiuYiBei = data.tianGanLiuYi; // 天干留意(备份)
                    this.diZhiLiuYiBei = data.diZhiLiuYi; // 地支留意(备份)

                    this.isLiuShiMingPan = true; // 左侧·是否显示流时命盘（true:是。false:否）
                }
            })

        },

        /**
         * 点击胎命身
         */
        taiMingShenMethod() {

            // 条件构造
            let query = {
                yearGan: this.data.yearGan, // 年干
                monthGan: this.data.monthGan, // 月干
                dayGan: this.data.dayGan, // 日干
                hourGan: this.data.hourGan, // 时干
                taiYuanGan: this.data.taiYuan.substring(0, 1), // 胎元干
                taiXiGan: this.data.taiXi.substring(0, 1), // 胎息干
                mingGongGan: this.data.mingGong.substring(0, 1), // 命宫干
                shenGongGan: this.data.shenGong.substring(0, 1), // 身宫干

                yearZhi: this.data.yearZhi, // 年支
                monthZhi: this.data.monthZhi, // 月支
                dayZhi: this.data.dayZhi, // 日支
                hourZhi: this.data.hourZhi, // 时支
                taiYuanZhi: this.data.taiYuan.substring(1, 2), // 胎元支
                taiXiZhi: this.data.taiXi.substring(1, 2), // 胎息支
                mingGongZhi: this.data.mingGong.substring(1, 2), // 命宫支
                shenGongZhi: this.data.shenGong.substring(1, 2), // 身宫支

                solarDate: this.data.solarDate, // 公历日期
                sex: this.data.sex, // 性别
                qiYunLiuPai: this.qiYunLiuPai, // 起运流派
                season: this.data.season, // 季节
                yearGanZhiNaYin: this.data.yearGanZhiNaYin // 年干支纳音
            }

            // 发送请求
            taiMingShenApi(query).then((res) => {
                if (String(res.data.code) === '200' && null !== res.data.data) {
                    var data = res.data.data;

                    this.taiMingShenMingPanData = data; // 左侧·胎命身命盘数据

                    this.tianGanLiuYi = data.tianGanLiuYi; // 天干留意
                    this.diZhiLiuYi = data.diZhiLiuYi; // 地支留意

                    this.isDaYunMingPan = false; // 左侧·是否显示大运命盘（true:是。false:否）
                    this.isLiuNianMingPan = false; // 左侧·是否显示流年命盘（true:是。false:否）
                    this.isLiuYueMingPan = false; // 左侧·是否显示流月命盘（true:是。false:否）
                    this.isLiuRiMingPan = false; // 左侧·是否显示流日命盘（true:是。false:否）
                    this.isLiuShiMingPan = false; // 左侧·是否显示流时命盘（true:是。false:否）
                    this.isTaiYuanMingPan = true; // 左侧·是否显示胎元命盘（true:是。false:否）
                    this.isTaiXiMingPan = true; // 左侧·是否显示胎息命盘（true:是。false:否）
                    this.isMingGongMingPan = true; // 左侧·是否显示命宫命盘（true:是。false:否）
                    this.isShenGongMingPan = true; // 左侧·是否显示身宫命盘（true:是。false:否）
                }
            })

        },

        /**
         * 返回排盘
         */
        fanHuiPaiPanMethod() {

            this.isData = false; // 数据状态（true:存在。false:不存在）
            this.dataPage = 1; // 数据显示界面（1:基础信息。2:命盘信息。3:更多信息）
            this.caiHuaTab = '1'; // 正财年卡片
            this.isDaYunData = false; // 大运流年数据状态（true:存在。false:不存在）

            this.isDaYunMingPan = true; // 左侧·是否显示大运命盘（true:是。false:否）
            this.isLiuNianMingPan = true; // 左侧·是否显示流年命盘（true:是。false:否）
            this.isLiuYueMingPan = false; // 左侧·是否显示流月命盘（true:是。false:否）
            this.isLiuRiMingPan = false; // 左侧·是否显示流日命盘（true:是。false:否）
            this.isLiuShiMingPan = false; // 左侧·是否显示流时命盘（true:是。false:否）
            this.isTaiYuanMingPan = false; // 左侧·是否显示胎元命盘（true:是。false:否）
            this.isTaiXiMingPan = false; // 左侧·是否显示胎息命盘（true:是。false:否）
            this.isMingGongMingPan = false; // 左侧·是否显示命宫命盘（true:是。false:否）
            this.isShenGongMingPan = false; // 左侧·是否显示身宫命盘（true:是。false:否）

            this.isLiuRiData = false; // 右侧·是否显示流日数据（true:是。false:否）
            this.isLiuShiData = false; // 右侧·是否显示流时数据（true:是。false:否）

            this.daYunLun = 1; // 大运轮
            this.liuNianLun = 1; // 流年轮
            this.liuYueLun = 0; // 流月轮
            this.liuRiLun = 0; // 流日轮
            this.liuShiLun = 0; // 流时轮

        },

        /**
         * 切换为基础信息
         */
        jiChuMethod() {

            this.dataPage = 1; // 数据显示界面（1:基础信息。2:命盘信息。3:更多信息）

        },

        /**
         * 切换为命盘信息
         */
        mingPanMethod() {

            this.daYunInitializeMethod(); // 大运流年初始化
            // this.dataPage = 2; // 数据显示界面（1:基础信息。2:命盘信息。3:更多信息）

        },

        /**
         * 切换为更多信息
         */
        gengDuoMethod() {

            this.dataPage = 3; // 数据显示界面（1:基础信息。2:命盘信息。3:更多信息）

        },

        /**
         * 五行高亮
         * 
         * @param wuXing 五行
         */
        wuXingGaoLiangMethod(wuXing) {

            if ('木' === wuXing) {
                return ('<font color=' + this.muColor + '">木</font>');
            }
            if ('火' === wuXing) {
                return ('<font color="' + this.huoColor + '">火</font>');
            }
            if ('土' === wuXing) {
                return ('<font color="' + this.tuColor + '">土</font>');
            }
            if ('金' === wuXing) {
                return ('<font color="' + this.jinColor + '">金</font>');
            }
            if ('水' === wuXing) {
                return ('<font color="' + this.shuiColor + '">水</font>');
            }

        },

        /**
         * 五行高亮2
         * 
         * @param wuXing 五行
         */
        wuXingGaoLiangMethod2(wuXing) {

            let l = wuXing.substring(0, 1);

            if ('木' === l) {
                return ('<font color="' + this.muColor + '">' + wuXing + '</font>');
            }
            if ('火' === l) {
                return ('<font color="' + this.huoColor + '">' + wuXing + '</font>');
            }
            if ('土' === l) {
                return ('<font color="' + this.tuColor + '">' + wuXing + '</font>');
            }
            if ('金' === l) {
                return ('<font color="' + this.jinColor + '">' + wuXing + '</font>');
            }
            if ('水' === l) {
                return ('<font color="' + this.shuiColor + '">' + wuXing + '</font>');
            }

        },

        /**
         * 干支高亮（阴干支斜体）
         * 
         * @param ganOrZhi 天干或地支
         */
        ganZhiGaoLiangMethod(ganOrZhi) {

            // 阳干支
            if ('甲' === ganOrZhi || '寅' === ganOrZhi) {
                return ('<font color="' + this.muColor + '">' + ganOrZhi + '</font>');
            }
            if ('丙' === ganOrZhi || '午' === ganOrZhi) {
                return ('<font color="' + this.huoColor + '">' + ganOrZhi + '</font>');
            }
            if ('戊' === ganOrZhi || '辰' === ganOrZhi || '戌' == ganOrZhi) {
                return ('<font color="' + this.tuColor + '">' + ganOrZhi + '</font>');
            }
            if ('庚' === ganOrZhi || '申' === ganOrZhi) {
                return ('<font color="' + this.jinColor + '">' + ganOrZhi + '</font>');
            }
            if ('壬' === ganOrZhi || '子' === ganOrZhi) {
                return ('<font color="' + this.shuiColor + '">' + ganOrZhi + '</font>');
            }

            // 阴干支
            if ('乙' === ganOrZhi || '卯' === ganOrZhi) {
                if (this.ganZhiYinYang) return ('<font color="' + this.muColor + '"><i>' + ganOrZhi + '</i></font>');
                return ('<font color="' + this.muColor + '">' + ganOrZhi + '</font>');
            }
            if ('丁' === ganOrZhi || '巳' === ganOrZhi) {
                if (this.ganZhiYinYang) return ('<font color="' + this.huoColor + '"><i>' + ganOrZhi + '</i></font>');
                return ('<font color="' + this.huoColor + '">' + ganOrZhi + '</font>');
            }
            if ('己' === ganOrZhi || '丑' === ganOrZhi || '未' === ganOrZhi) {
                if (this.ganZhiYinYang) return ('<font color="' + this.tuColor + '"><i>' + ganOrZhi + '</i></font>');
                return ('<font color="' + this.tuColor + '">' + ganOrZhi + '</font>');
            }
            if ('辛' === ganOrZhi || '酉' === ganOrZhi) {
                if (this.ganZhiYinYang) return ('<font color="' + this.jinColor + '"><i>' + ganOrZhi + '</i></font>');
                return ('<font color="' + this.jinColor + '">' + ganOrZhi + '</font>');
            }
            if ('癸' === ganOrZhi || '亥' === ganOrZhi) {
                if (this.ganZhiYinYang) return ('<font color="' + this.shuiColor + '"><i>' + ganOrZhi + '</i></font>');
                return ('<font color="' + this.shuiColor + '">' + ganOrZhi + '</font>');
            }

        },

        /**
         * 干支高亮（阴干支斜体）
         * 
         * @param ganZhi 干支
         */
        ganZhiGaoLiangMethod2(ganZhi) {

            let gan = ganZhi.substring(0, 1); // 天干
            let zhi = ganZhi.substring(1, 2); // 地支

            if ('甲' === gan) {
                gan = ('<font color="' + this.muColor + '">' + gan + '</font>');
            } else if ('丙' === gan) {
                gan = ('<font color="' + this.huoColor + '">' + gan + '</font>');
            } else if ('戊' === gan) {
                gan = ('<font color="' + this.tuColor + '">' + gan + '</font>');
            } else if ('庚' === gan) {
                gan = ('<font color="' + this.jinColor + '">' + gan + '</font>');
            } else if ('壬' === gan) {
                gan = ('<font color="' + this.shuiColor + '">' + gan + '</font>');
            } else if ('乙' === gan) {
                gan = this.ganZhiYinYang ? ('<font color="' + this.muColor + '"><i>' + gan + '</i></font>') : ('<font color="' + this.muColor + '">' + gan + '</font>');
            } else if ('丁' === gan) {
                gan = this.ganZhiYinYang ? ('<font color="' + this.huoColor + '"><i>' + gan + '</i></font>') : ('<font color="' + this.huoColor + '">' + gan + '</font>');
            } else if ('己' === gan) {
                gan = this.ganZhiYinYang ? ('<font color="' + this.tuColor + '"><i>' + gan + '</i></font>') : ('<font color="' + this.tuColor + '">' + gan + '</font>');
            } else if ('辛' === gan) {
                gan = this.ganZhiYinYang ? ('<font color="' + this.jinColor + '"><i>' + gan + '</i></font>') : ('<font color="' + this.jinColor + '">' + gan + '</font>');
            } else if ('癸' === gan) {
                gan = this.ganZhiYinYang ? ('<font color="' + this.shuiColor + '"><i>' + gan + '</i></font>') : ('<font color="' + this.shuiColor + '">' + gan + '</font>');
            }

            if ('寅' === zhi) {
                zhi = ('<font color="' + this.muColor + '">' + zhi + '</font>');
            } else if ('午' === zhi) {
                zhi = ('<font color="' + this.huoColor + '">' + zhi + '</font>');
            } else if ('辰' === zhi || '戌' === zhi) {
                zhi = ('<font color="' + this.tuColor + '">' + zhi + '</font>');
            } else if ('申' === zhi) {
                zhi = ('<font color="' + this.jinColor + '">' + zhi + '</font>');
            } else if ('子' === zhi) {
                zhi = ('<font color="' + this.shuiColor + '">' + zhi + '</font>');
            } else if ('卯' === zhi) {
                zhi = this.ganZhiYinYang ? ('<font color="' + this.muColor + '"><i>' + zhi + '</i></font>') : ('<font color="' + this.muColor + '">' + zhi + '</font>');
            } else if ('巳' === zhi) {
                zhi = this.ganZhiYinYang ? ('<font color="' + this.huoColor + '"><i>' + zhi + '</i></font>') : ('<font color="' + this.huoColor + '">' + zhi + '</font>');
            } else if ('丑' === zhi || '未' === zhi) {
                zhi = this.ganZhiYinYang ? ('<font color="' + this.tuColor + '"><i>' + zhi + '</i></font>') : ('<font color="' + this.tuColor + '">' + zhi + '</font>');
            } else if ('酉' === zhi) {
                zhi = this.ganZhiYinYang ? ('<font color="' + this.jinColor + '"><i>' + zhi + '</i></font>') : ('<font color="' + this.jinColor + '">' + zhi + '</font>');
            } else if ('亥' === zhi) {
                zhi = this.ganZhiYinYang ? ('<font color="' + this.shuiColor + '"><i>' + zhi + '</i></font>') : ('<font color="' + this.shuiColor + '">' + zhi + '</font>');
            }

            return gan + zhi;

        },

        /**
         * 干支五行高亮
         * 
         * @param ganOrZhi 天干或地支
         */
        ganZhiInWuXingGaoLiangMethod(ganOrZhi) {

            if ('甲' === ganOrZhi || '乙' === ganOrZhi || '寅' === ganOrZhi || '卯' === ganOrZhi) {
                return ('<font color="' + this.muColor + '">木</font>');
            }
            if ('丙' === ganOrZhi || '丁' === ganOrZhi || '巳' === ganOrZhi || '午' === ganOrZhi) {
                return ('<font color="' + this.huoColor + '">火</font>');
            }
            if ('戊' === ganOrZhi || '己' === ganOrZhi || '辰' === ganOrZhi || '戌' === ganOrZhi || '丑' === ganOrZhi || '未' === ganOrZhi) {
                return ('<font color="' + this.tuColor + '">土</font>');
            }
            if ('庚' == ganOrZhi || '辛' === ganOrZhi || '申' === ganOrZhi || '酉' === ganOrZhi) {
                return ('<font color="' + this.jinColor + '">金</font>');
            }
            if ('壬' === ganOrZhi || '癸' === ganOrZhi || '亥' === ganOrZhi || '子' === ganOrZhi) {
                return ('<font color="' + this.shuiColor + '">水</font>');
            }

        },

        /**
         * 通知提示（右上角弹出）
         * 
         * @param type 消息类型（success、warning、info、error）
         * @param duration 自动关闭延迟，0为不关闭（单位：毫秒）
         * @param title 标题
         * @param message 提示内容
         */
        notification(type, duration, title, message) {

            ElNotification({
                type: type,
                title: title,
                message: message,
                duration: duration,
                position: 'top-right',
                dangerouslyUseHTMLString: true
            })

        }

    }
}
